<template>
  <div class="app">
    <form @submit.prevent="logForm" action="">
    姓名 <input v-model.lazy="list.name" type="text">
    <br>年龄 <input  v-model.number="list.age" type="text">
    <br>组号 <select v-model="list.group">
        <option :key="item" v-for="item in 5" :value="item" >第{{item}}组</option>
    </select>
   <br> 性别 <input v-model="list.gender" type="radio" value="man" checked> 男<input v-model="list.gender" type="radio" value="woman">女
    <br>标签 <div :key="item" v-for="item in label"><input :value="item" v-model="list.labelList" type="checkbox">{{item}}</div>
        <br><button>提交</button>
        



        
    </form>










    
  </div>
</template>

<script>
export default {
  data() {
    return {
      num:0,
        list:{
            name:'',
            age:'',
            group:'',
            gender:'',
            labelList:[],
        },
        label:['班长','排长','队长']

        
    };
  },
  methods: {
    logForm(){
      console.log({...this.list});
      for (const key in this.list) {
      console.log(key +':'+this.list[key]);

      }
    }
  },
};
</script>

<style lang="less">
</style>